<template>
	<view class="infoUpload_container">
		<uni-forms ref="baseForm" :modelValue="baseFormData" :rules="rules">
			<uni-forms-item label="姓名" required name="name">
				<uni-easyinput v-model="baseFormData.name" placeholder="请输入姓名" />
			</uni-forms-item>
			<uni-forms-item label="性别" required name="sex">
				<uni-data-checkbox v-model="baseFormData.sex" :localdata="sexs" />
			</uni-forms-item>
			<uni-forms-item label="手机号" required name="phone">
				<uni-easyinput v-model="baseFormData.phone" placeholder="请输入手机号码" />
			</uni-forms-item>
			<uni-forms-item label="年龄" required name="age"> 
				<uni-easyinput v-model="baseFormData.age" placeholder="请输入年龄" />
			</uni-forms-item>
			<uni-forms-item label="城市" required  name="city">
				<uni-data-picker
					placeholder="请选择城市"
					popup-title="请选择所在地区"
					:localdata="dataTree"
					v-model="baseFormData.city"
				></uni-data-picker>
			</uni-forms-item>
			
			<uni-forms-item label="学历" required  name="education">
				<uni-data-checkbox v-model="baseFormData.education" :localdata="educations" />
			</uni-forms-item>
			
			<uni-forms-item label="身份" required  name="identity">
				<uni-data-checkbox v-model="baseFormData.identity" :localdata="identitys" />
			</uni-forms-item>
			
			<uni-forms-item label="单位类型" required  name="work">
				<uni-data-checkbox v-model="baseFormData.work" :localdata="works" />
			</uni-forms-item>
			
			<uni-forms-item label="税前收入" required  name="income">
				<uni-data-checkbox v-model="baseFormData.income" :localdata="incomes" />
			</uni-forms-item>
			
			<uni-forms-item label="征信" required  name="credit">
				<uni-data-checkbox v-model="baseFormData.credit" :localdata="credits" />
			</uni-forms-item>
			
			<uni-forms-item label="资质(可多选)" required name="certification">
				<uni-data-checkbox multiple  v-model="baseFormData.certification" :localdata="certifications" />
			</uni-forms-item>
		</uni-forms>
		<view class="button-group">
			<button type="primary" size="mini" style="font-weight: 500; width: 260rpx; height: 60rpx; background-color: #5393cf; color: #ffffff;" @click="submitInfo('dynamicForm')">开始测试</button>
		</view>
	</view>
</template>

<script setup>
import { reactive, ref } from 'vue';
import {city} from '@/common/city.js'
import { onLoad} from "@dcloudio/uni-app";

const baseFormData = reactive({
	name:'',
	sex:'',
	phone:'',
	age:'',
	// 资金
	demand: "0",
	// 城市
	city:'',
	// 学历
	education:'',
	// 身份
	identity:'',
	// 单位类型
	work: '',
	// 税前收入
	income: '',
	// 征信
	credit:'',
	// 资质
	certification:'',
	// 备注信息
	remark: '客户自传'
})

onLoad(e=>{
	baseFormData.clientType = 1
	console.log(baseFormData);
})

// 性别
const sexs = [
	{ text: '男', value: 0 },
	{ text: '女', value: 1 },
	{ text: '未知', value: 2}
]

// 城市
const dataTree = city


// 学历
const educations = [
	{ text: '高中及以下', value: 0 },
	{ text: '大专', value: 1 },
	{ text: '本科', value: 2 },
	{ text: '研究生及以上', value: 3 },
	{ text: '未知', value: 4 }
]

// 身份
const identitys = [
	{ text: '上班族', value: 0 },
	{ text: '企业主（法人/股东）', value: 1 },
	{ text: '个体户或自由职业', value: 2 },
	{ text: '未知', value: 3 }
]

// 单位类型
const works = [
	{ text: '私营企业', value: 0 },
	{ text: '事业单位', value: 1 },
	{ text: '上市公司', value: 2 },
	{ text: '政府机关', value: 3 },
	{ text: '未知', value: 4 }
]

// 税前收入
const incomes = [
	{ text: '0-2999', value: 0 },
	{ text: '3000-4999', value: 1 },
	{ text: '5000-7999', value: 2 },
	{ text: '8000-14999', value: 3 },
	{ text: '15000以上', value: 4 },
	{ text: '未知', value: 5 },
]

// 征信
const credits = [
	{ text: '我是白户', value: 0 },
	{ text: '征信良好', value: 1 },
	{ text: '有逾期', value: 2 },
	{ text: '有多次查询', value: 3 },
	{ text: '未知', value: 4 }
]

// 资质
const certifications = [
	{ text: '按揭房', value: 0 },
	{ text: '全款房', value: 1 },
	{ text: '按揭车', value: 2 },
	{ text: '全款车', value: 3 },
	{ text: '保单', value: 4 },
	{ text: '公积金', value: 5 },
	{ text: '社保', value: 6 },
	{ text: '企业开票/纳税', value: 7 },
	{ text: '未知', value: 8 }
]

const getValueText = (value, mapping) =>{  
	const item = mapping.find(item => item.value === value);
	return item ? item.text : '';
}

let baseForm = ref()

const rules = {
	name:{
		rules:[
			{ required: true, errorMessage: '请填写名字' },
			{
				validateFunction(rule,value,data,callback){
					if (!/^[\u4e00-\u9fa5]+(\s[\u4e00-\u9fa5]+)*$/.test(value)) {
						callback('请正确填写中文名字')
					}
					return true
				}	
			},
		],
	},
	sex:{rules:[{required: true, errorMessage: '请选择性别'}]},
	phone:{
		rules:[
			{ required: true, errorMessage: '请填写11位手机号', pattern: '/^1[3-9]\d{9}$/'},
			{
				validateFunction(rule,value,data,callback){
					if (!/^1[3-9]\d{9}$/.test(value)) {
						callback('请正确填写11位手机号')
					}
					return true
				}		
			}
		]
	},
	age:{
		rules:[
			{ required: true, errorMessage: '请填写年龄' },
			{
				validateFunction(rule,value,data,callback){
					if (!/^(0|[1-9]\d?|1[0-4]\d|150)$/.test(value)) {
						callback('请正确填写年龄')
					}
					return true
				}	
			},
		],
	},
	// 资金
	demand:{
		rules:[
			{ required: true,errorMessage: '请填写资金需求' },
			{
				validateFunction(rule,value,data,callback){
					if (!/^\d+$/.test(value)) {
						callback('请填写正确的资金需求')
					}
					return true
				}	
			},
		],
	},
	// 城市
	city:{rules:[{required: true,errorMessage: '请填写所在城市'}]},
	// 学历
	education:{rules:[{required: true,errorMessage: '请选择学历'}]},
	// 身份
	identity:{rules:[{required: true,errorMessage: '请选择身份类型'}]},
	// 单位类型
	work:{rules:[{required: true,errorMessage: '请选择单位类型'}]},
	// 税前收入
	income: {rules:[{required: true,errorMessage: '请选择税前收入'}]},
	// 征信
	credit:{rules:[{required: true,errorMessage: '请选择征信情况'}]},
	// 资质
	certification:{rules:[{required: true,errorMessage: '请选择资质情况'}]},
	// 备注信息
	remark: ''
}

const submitInfo = ()=>{
	baseForm.value.validate().then(res=>{
		baseFormData.clientType = 0
		uni.showLoading({
			mask: true,
			title: '资料提交中'
		})
		
		uniCloud.database().collection("zf_limitInfo").add(baseFormData).then((res)=>{
			uni.hideLoading()
			uni.showToast({ title:'提交成功，等待工作人员联系', duration:3000 })
			setTimeout(()=>{
				uni.switchTab({ url: '/pages/index/index' });
			},3000)
			
		}).catch(err=>{
			uni.hideLoading()
			uni.showToast({
				title: err+ '',
				icon: "none"
			})
		})
	}).catch(err =>{
		uni.showToast({
			title: err[0].errorMessage,
			icon: "none"
		})	
	})

}

</script>

<style lang="scss" scoped>
.infoUpload_container {
	height: 100vh;
	width: 100vw;
	box-sizing: border-box;
	color: #000;
	background-image:linear-gradient(0deg,#e0f7e9 0%, #f5fdfd 48%, #eff5fb 100%);
	padding: 20rpx 30rpx 30rpx;
	font-weight: 500;
	font-size: 24rpx;
	box-sizing: border-box;
	overflow: auto;
	.from {
		border: 1px solid red;

		.uni-form-item{
			display: flex;
		}
	}
	.button-group{
		display: flex;
		justify-content: center;
		button{
			width: 200rpx;
		}
	}
}
</style>